<template>
  <div class="app-container">
    <search-pannel
      v-model="element"
      :btn-items="btnItems"
      @searchmethod="search($event, condition)"
      @create="create($event)"
    />
    <CreateOrUpdate
      v-if="createOrUpdateVisible"
      ref="createorupdate"
      @refreshDataList="getDataList()"
    />
    <EditProcessModel
      v-if="designvisible"
      ref="editprocessmodel"
      @refreshDataList="getDataList()"
    />

  </div>
</template>
<script>
import SearchPannel from '@/components/SearchPannel'
import { fetchAll } from '@/api/tenant'
import { getPublishProcess, recoverProcessModel } from '@/api/workflowprocess'
export default {
  components: {
    SearchPannel
  },
  data() {
    return {
      tenantList: [],
      createOrUpdateVisible: false,
      designvisible: false,
      designObject: {

      },
      element: {
        searchresult: '',
        pageIndex: 1,
        pageSize: 10,
        total: 1,
        totalPage: 1,
        dataList: [],
        grid: {
          normalitems: [{
            prop: 'Name',
            label: '名称'
          }, {
            prop: 'Code',
            label: '代码'
          }, {
            prop: 'TenantName',
            label: '租户'
          }, {
            prop: 'stateName',
            label: '状态'
          }, {
            prop: 'Version',
            label: '版本'
          }],
          operationitem: [{
            name: '修改',
            icon: 'el-icon-edit'
          }, {
            name: '历史',
            icon: 'el-icon-document'
          }, {
            name: '挂起',
            // eslint-disable-next-line no-self-compare
            icon: 'el-icon-setting',
            show: (row) => { return row.Status === 1 },
            method: (row) => {
              this.hangupHandler(row)
            }
          }, {
            name: '恢复',
            // eslint-disable-next-line no-self-compare
            show: (row) => { return row.Status === 0 },
            icon: 'el-icon-setting',
            method: (row) => {
              this.recoverHandler(row)
            }
          }]
        },
        filters: {
          isShow: false
        }
      },
      // 功能区按钮列表
      btnItems: [{
        name: '新  建',
        code: 'create',
        clientevent: () => {
          this.create()
        }
      }, {
        name: '批量删除',
        code: 'batchDel',
        clientevent: () => {
          this.delete()
        }
      }]
    }
  },
  mounted() {
    // 获取租户
    fetchAll().then((data) => {
      if (data && data.code === '20000') {
        const result = data.data
        this.tenantList = result
      }
    }).then(() => {
      this.getDataList()
    })
  },
  methods: {
    getDataList() {
      this.dataListLoading = true
      const condition = {
        limit: this.element.pageSize,
        offset: this.element.pageSize * (this.element.pageIndex - 1)
      }
      const searchcondition = this.element.searchresult
      if (searchcondition) {
        condition.query = `Code.contains:${searchcondition},Condition_Join:or,Name.contains:${searchcondition}`
      }
      getPublishProcess(condition).then((data) => {
        if (data.data && data.data.length > 0) {
          data.data.forEach((item, index) => {
            if (item.Status === 0) {
              item.stateName = '挂起'
            } else if (item.Status === 1) {
              item.stateName = '运行中'
            } else {
              item.stateName = ''
            }
            const re = this.tenantList.filter(r => r.Id === item.Tenant)
            if (re && re.length > 0) {
              item.TenantName = re[0].Name
            } else {
              item.TenantName = ''
            }
          })
          this.element.dataList = data.data
          this.element.totalPage = data.count % this.element.pageSize === 0 ? (data.count / this.element.pageSize) : (Math.floor(data.count / this.element.pageSize) + 1)
          this.element.total = data.count
          this.element.dataListLoading = false
        }
      // eslint-disable-next-line handle-callback-err
      }).catch((error) => {
        this.element.dataListLoading = false
      })
    },
    search() {
      this.getDataList()
    },
    hangupHandler(row) {
      this.$confirm(`确定对[Name=${row.Name}]进行[挂起]操作?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        recoverProcessModel(row.Id).then((data) => {
          if (data && data.code === '20000') {
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
                this.getDataList()
              }
            })
          } else {
            this.$message.error(data.msg)
          }
        })
      })
    },
    recoverHandler(row) {
      this.$confirm(`确定对[Name=${row.Name}]进行[恢复]操作?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        recoverProcessModel(row.Id).then((data) => {
          if (data && data.code === '20000') {
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
                this.getDataList()
              }
            })
          } else {
            this.$message.error(data.msg)
          }
        })
      })
    }
  }
}
</script>
